<html>
<head>
<title>RChart, User Guide</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body bgcolor="#FFFFFF" leftmargin="35">
<h3>RCHART, User Guide</h3>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><i>Copyright 2005, J4L 
  Components (http://www.java4less.com)</i></font> <br>
  <a href="tutorialcontents.html">Go bak to contents</a></p>
<hr>
<h3><font face="Arial, Helvetica, sans-serif">Scale configuration / parameters 
  </font></h3>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"><a href="#0">Maximum 
    and minimum values</a></font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"><a href="#1">Logarithmic 
    Scales </a></font></li>
  <li><a href="#dates"><font face="Arial, Helvetica, sans-serif" size="-1">Date 
    and time based scales</font></a></li>
</ul>
<p>&nbsp;</p>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><b><a name="0"></a>Maximum 
  and minimum values</b></font></h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The following section describes 
  how the maximum and minimum values of the scale are calculated. The examples 
  refer to the Y-Axis, however the same parameters are also available for the 
  X and Y2 axis.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">If you want to plot the 
  following values:</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">10, 41 , 48 , 39, 36 ,34 
  , 49</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">you can use the following 
  way in order to calculate the maximum and minimum values of the axis:</font></p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">default maximum and 
    minimum. If you do not specify the minimum and/or maximum value for the scale, 
    rchart will use the minimum and maximum value of the set you want to chart. 
    The result will be: minimum=10 and maximum=49</font></li>
</ul>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><img src="images/scmindefault.PNG" width="39" height="205"></font></p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">specify maximum and 
    minimum. You can also calculate the values and pass them to rchart. For example 
    you can use</font></li>
</ul>
<table width="100%" border="0" height="71">
  <tr> 
    <td width="30%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Parameters</i></b></font></div>
    </td>
    <td width="26%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Description</i></b></font></div>
    </td>
    <td width="44%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Equivalent java class/property</i></b></font></div>
    </td>
  </tr>
  <tr> 
    <td width="30%" valign="top" height="46"> 
      <p>YSCALE_MIN=0<br>
        YSCALE_MAX=50</p>
    </td>
    <td width="26%" valign="top" height="46"> 
      <p><font color="#3333FF">Minimum value of the scale<br>
        Maxumim value of the scale </font></p>
    </td>
    <td width="44%" valign="top" height="46"> 
      <div align="left"> 
        <p>xaxis.scale.min<br>
          yaxis.scale.max <br>
        </p>
      </div>
    </td>
  </tr>
</table>
<p><font face="Arial, Helvetica, sans-serif" size="-1">the result will be:</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><img src="images/scminmax.PNG" width="33" height="191"></font></p>
<p>&nbsp;</p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">preferred maximum and 
    minimum. You can also let RChart calculate the values from a list of predefined 
    values. In this case you must use the following parameters:</font></li>
</ul>
<table width="100%" border="0" height="71">
  <tr> 
    <td width="56%" valign="top" bgcolor="#CCCCCC" height="30"> 
      <div align="center"><font color="#000000"><b><i>Parameters</i></b></font></div>
    </td>
    <td width="20%" valign="top" bgcolor="#CCCCCC" height="30"> 
      <div align="center"><font color="#000000"><b><i>Description</i></b></font></div>
    </td>
    <td width="24%" valign="top" bgcolor="#CCCCCC" height="30"> 
      <div align="center"><font color="#000000"><b><i>Equivalent java class/property</i></b></font></div>
    </td>
  </tr>
  <tr> 
    <td width="56%" valign="top" height="34"> 
      <p>YSCALE_EXACT_MAX=true <br>
        YSCALE_EXACT_MIN=true<br>
        YSCALE_PREF_MAXMIN=-1000000|-500000|-100000|-50000|-10000|-5000|-1000|-500|-250|-100|-50|-25-10|-5|-1|-0.5|-|0.1|0|0.1|0.5|1|5|<b><font color="#FF3333">10</font></b>|25|<font color="#3333FF"><b>50</b></font>|100|250|500|1000|5000|10000|50000|100000|500000|1000000</p>
    </td>
    <td width="20%" valign="top" height="34"> 
      <p><font color="#3333FF">Take the min. and max. values from the list of 
        preferred values. </font></p>
    </td>
    <td width="24%" valign="top" height="34"> 
      <div align="left"> 
        <p>yaxis.scale.exactMaxValue<br>
          yaxis.scale.exactMinValue <br>
          yaxis.scale.preferred_MaxMin_values </p>
      </div>
    </td>
  </tr>
</table>
<p>&nbsp;</p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">RChart will use one of 
  the values from the list you provided. This list must be sorted in ascending 
  order and RChart will always select the first value that meets the condition:</font></p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">for the minimum: will 
    select the highest value that is smaller than all values in your data set. 
    (See red value in list)</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">for the maximum: will 
    select the lowest value that is higher than all values in your data set. (See 
    blue value in list)</font></li>
</ul>
<p>&nbsp;</p>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><img src="images/scPreferred.PNG" width="36" height="197"></font></p>
<p>&nbsp;</p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">You can also combine 
    all methods. For example you can set the minimum value as 0 always and let 
    RChart calculate the maximum value:</font></li>
</ul>
<table width="100%" border="0" height="71">
  <tr> 
    <td width="30%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Parameters</i></b></font></div>
    </td>
    <td width="26%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Description</i></b></font></div>
    </td>
    <td width="44%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Equivalent java class/property</i></b></font></div>
    </td>
  </tr>
  <tr> 
    <td width="30%" valign="top" height="34"> 
      <p>YSCALE_MIN=0<br>
        YSCALE_EXACT_MIN=false<br>
        YSCALE_EXACT_MAX=true <br>
        YSCALE_PREF_MAXMIN=-1000000|-500000|-100000|-50000|-10000|-5000|-1000|-500|-250|-100|-50|-25-10|-5|-1|-0.5|-|0.1|0|0.1|0.5|1|5|<font color="#000000">10</font>|25|<font color="#3333FF"><b>50</b></font>|100|250|500|1000|5000|10000|50000|100000|500000|1000000</p>
    </td>
    <td width="26%" valign="top" height="34"> 
      <p><font color="#3333FF">Minimum is 0<br>
        Take max. value from the list of preferred values. </font></p>
    </td>
    <td width="44%" valign="top" height="34"> 
      <div align="left"> 
        <p>yaxis.scale.min<br>
          yaxis.scale.exactMaxValue<br>
          yaxis.scale.exactMinValue <br>
          yaxis.scale.preferred_MaxMin_values<br>
        </p>
      </div>
    </td>
  </tr>
</table>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><img src="images/scMaxminCombined.PNG" width="33" height="191"></font></p>
<p>&nbsp;</p>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><a name="1"></a>Logarithmic 
  Scales </font></h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">the following additional 
  parameters are needed for logarithmic scales:</font></p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">XSCALE_LOG, YSCALE_LOG 
    and Y2SCALE_LOG. if &quot;true&quot; the scale will be logarithmic. </font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">XSCALE_LOG_BASE, YSCALE_LOG_BASE 
    and Y2SCALE_LOG_BASE. Base of the logarithm. </font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">TICK_LOG_INTERVALY,TICK_LOG_INTERVALX 
    and TICK_LOG_INTERVALY2. If &quot;true&quot; the ticks will be printed at 
    logarithmic intervals (which is fixed intervals in the screen). If false the 
    TICK_INTERVAL will be used to draw the ticks at fixed value intervals (not 
    screen intervals). </font></li>
</ul>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><br>
  Note: logarithmic scales do not accept negative values.</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">Example 1:</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">A base of 10 means that 
  the distance between 1 and 10 will be the same as the distance between 10 and 
  100, 100 and 1000 ...<br>
  </font></p>
<table width="100%" border="0" height="71">
  <tr> 
    <td width="30%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Parameters</i></b></font></div>
    </td>
    <td width="26%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Description</i></b></font></div>
    </td>
    <td width="44%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Equivalent java class/property</i></b></font></div>
    </td>
  </tr>
  <tr> 
    <td width="30%" valign="top" height="34"> 
      <p>TICK_LOG_INTERVALY=true<br>
        <br>
        YSCALE_LOG= true<br>
        YSCALE_LOG_BASE=10<br>
        YSCALE_MIN=0<br>
        YSCALE_MAX = 1000</p>
    </td>
    <td width="26%" valign="top" height="34"> 
      <p><font color="#3333FF">Ticks show not be placed at fixed intervals bu 
        using logaritmic scale.</font><br>
        <font color="#3333FF">Y Scale will use logarithmin scale<br>
        base 10<br>
        minimum and maximum values</font></p>
    </td>
    <td width="44%" valign="top" height="34"> 
      <div align="left"> 
        <p>YAxis.logarithmicIntervals=true;<br>
          <br>
          YAxis.scale=logScale(); <br>
          ((logScale) YAxis.scale).base=10;<br>
          YAxis.scale.min=0; <br>
          YAxis.scale.min=1000; <br>
        </p>
      </div>
    </td>
  </tr>
</table>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><img src="images/sclog.PNG" width="53" height="398"></font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">Example 2:</font></p>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The default base is 2. 
  This means, the distance between 1 and 2 will be the same as the distance between 
  2 and 4, 4 and 8.. </font></p>
<table width="100%" border="0" height="71">
  <tr> 
    <td width="30%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Parameters</i></b></font></div>
    </td>
    <td width="26%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Description</i></b></font></div>
    </td>
    <td width="44%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Equivalent java class/property</i></b></font></div>
    </td>
  </tr>
  <tr> 
    <td width="30%" valign="top" height="34"> 
      <p>TICK_LOG_INTERVALY=true<br>
        TSCALE_LOG=true<br>
        YSCALE_LOG_BASE=2<br>
        <br>
        YSCALE_MIN=0<br>
        YSCALE_MAX = 1024</p>
    </td>
    <td width="26%" valign="top" height="34"> 
      <p><font color="#3333FF">Ticks show not be placed at fixed intervals bu 
        using logaritmic scale.</font><br>
        <font color="#3333FF">Y Scale will use logarithmin scale<br>
        base 2<br>
        minimum and maximum values</font></p>
    </td>
    <td width="44%" valign="top" height="34"> 
      <div align="left"> 
        <p>YAxis.logarithmicIntervals=true;<br>
          <br>
          YAxis.scale=logScale(); <br>
          ((logScale) YAxis.scale).base=2;<br>
          YAxis.scale.min=0; <br>
          YAxis.scale.min=1024; <br>
        </p>
      </div>
    </td>
  </tr>
</table>
<p><font face="Arial, Helvetica, sans-serif" size="-1"><img src="images/sclog2.PNG" width="46" height="406"></font></p>
<h4><font face="Arial, Helvetica, sans-serif" size="-1"><a name="dates"></a>Date 
  and time based scales</font></h4>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The following example shows 
  a chart that has a date based X axis/scale. As you can see in the table below 
  the SERIE_DATAX_1 parameter, we are providing the position of the values not 
  as an integer value but as a date value (The same procedure could be used for 
  the Y value using SERIE_DATA if you have a date based Y scale).</font></p>
<p><img src="images/scaleDate.PNG" width="301" height="301"></p>
<table width="100%" border="0" height="71">
  <tr> 
    <td width="30%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Parameters</i></b></font></div>
    </td>
    <td width="28%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Description</i></b></font></div>
    </td>
    <td width="42%" valign="top" bgcolor="#CCCCCC" height="27"> 
      <div align="center"><font color="#000000"><b><i>Equivalent java class/property</i></b></font></div>
    </td>
  </tr>
  <tr> 
    <td width="30%" valign="top" height="529"> 
      <p>&nbsp;</p>
      <p><b><br>
        XAXIS_INITIAL_DATE=10/01/2005<br>
        XAXIS_FINAL_DATE=10/03/2005<br>
        XAXIS_DATE_STEP=d<br>
        XAXIS_DATE_FORMAT=dd-MM-yy<br>
        SERIE_DATAX_1 =10/01/2005|14/01/2005|10/02/2005 </b></p>
      <p><br>
        TITLECHART=Date input Axis example<br>
        LEGEND=FALSE<br>
        XLABEL=Date<br>
        YLABEL=Value<br>
        SERIE_1=Serie 1<br>
        SERIE_STYLE_1=1|RED|LINE<br>
        SERIE_FONT_1=Arial|PLAIN|10<br>
        SERIE_COLOR_1=RED<br>
        SERIE_POINT_COLOR_1=RED<br>
        SERIE_POINT_1=true<br>
        SERIE_DATA_1=1|4|7 <br>
        SERIE_TYPE_1=LINE<br>
        CHART_BORDER=0.2|BLACK|LINE<br>
        CHART_FILL=0xA0A0FF<br>
        BIG_TICK_INTERVALX=10<br>
        BIG_TICK_INTERVALY=1<br>
        TICK_INTERVALX=1<br>
        TICK_INTERVALY=1<br>
        YSCALE_MIN=0<br>
        XSCALE_MIN=0<br>
        LEGEND_BORDER=0.2|BLACK|LINE<br>
        LEGEND_FILL=WHITE<br>
        XAXIS_GRID=0.2|WHITE|DASHED<br>
        YAXIS_GRID=0.2|WHITE|DASHED<br>
        XAXIS_TICKATBASE=true<br>
        GRIDY=true<br>
        GRIDX=true</p>
      </td>
    <td width="28%" valign="top" height="529"> 
      <p><font color="#3333FF">These are the parameters related to the date scale.</font><font color="#3333FF"><br>
        </font><br>
        <font color="#3333FF">Minimum value of the scale</font><br>
        <font color="#3333FF">Maximum value of the scale</font><br>
        <font color="#3333FF">Tick step (1 days)</font><br>
        <font color="#3333FF">Format of the labels in the axis</font> <br>
        <font color="#3333FF">Position of the x values</font> </p>
      <p>&nbsp; </p>
      <p><font color="#3333FF">The rest of parameters required to create the chart 
        are explained in other sections of this manual.</font><font color="#3333FF"></font></p>
      </td>
    <td width="42%" valign="top" height="529"> 
      <div align="left"> 
        <p><br>
        </p>
        <p>XAxis.dateStepPerUnit=true; // enable dateStep property<br>
          XAxis.initialDate=initialdate;<br>
          XAxis.dateStep=&quot;d&quot;; <br>
          XAxis.scale.max=60; // days,units between initial and final date<br>
          XAxis.dateLabelFormat=&quot;dd-MM-yy&quot;; </p>
        <p>// create data serie, first convert dates to double values<br>
          double value1= Axis.convertFromDate( date1, dateStep, initialdate); 
          <br>
          double value2= Axis.convertFromDate( date2, dateStep, initialdate); 
          <br>
          ...<br>
          double[] valuesX={value1,value2....};<br>
          serie1=new LineDataSerie(valuesX, valuesY, lineStyle); </p>
      </div>
    </td>
  </tr>
</table>
<p><font face="Arial, Helvetica, sans-serif" size="-1">The description of the 
  parameters required to define a date (or time) based scale are:</font></p>
<ul>
  <li><font face="Arial, Helvetica, sans-serif" size="-1">XAXIS_INITIAL_DATE or 
    YAXIS_INITIAL_DATE: Start date or time of the scale. The format must be dd-MM-yyyy 
    or (dd-MM-yyyy HH:mm:ss for time values). You can also use / as date separator.</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"> XAXIS_FINAL_DATE or 
    YAXIS_FINAL_DATE: End date or time of the scale.</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"> XAXIS_DATE_STEP or 
    YAXIS_DATE_STEP: Working unit fo axis and scale (d-days, m-month, w-week, 
    y-year, h-hour, s-second-n-minutes). The value can be followed by a integer 
    value (&quot;d7&quot; mean 7 days which would the same as &quot;w&quot;). 
    For example a </font><font face="Arial, Helvetica, sans-serif" size="-1"><font face="Arial, Helvetica, sans-serif" size="-1">XAXIS_DATE_STEP</font>=m 
    and a TICK_INTERVALX=2 means rchart will paint a tick every 2 months.</font></li>
  <li><font face="Arial, Helvetica, sans-serif" size="-1"> XAXIS_DATE_FORMAT or 
    YAXIS_DATE_FORMAT: output format of the dates in the tick labels.</font></li>
</ul>
<p>The following example shows how to create a time based scale:</p>
<p>SERIE_DATAX_1=01/01/2005 1:20:00|01/01/2005 1:35:00|01/01/2005 1:45:00|01/01/2005 
  2:00:00<br>
  XAXIS_INITIAL_DATE=01-01-2005 00:00:00<br>
  XAXIS_FINAL_DATE=01-01-2005 03:00:00<br>
  XAXIS_DATE_STEP=n20<br>
  XAXIS_DATE_FORMAT=HH:mm</p>
<p><font size="-1" face="Arial, Helvetica, sans-serif">Note that the date &quot;01-01-2005&quot; 
  is irrelevant since wer are only displaying the time value. The unit is 20 minutes 
  (n20) between 00:00:00 and 03:00:00.</font> </p>
<p>&nbsp;</p>
<hr>
<p>&nbsp;</p>
</body>
</html>
